<html>
<head>
	<meta id="viewport" name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
	<link href="/images/apple-touch-icon.png" rel="apple-touch-icon" />	
	<title>Wiki2Touch</title>
	<style type="text/css">
	
		a:link { font-weight:bold; text-decoration:none; }
		a:visited { font-weight:bold; text-decoration:none; }
		a:focus { font-weight:bold; text-decoration:none; }
		a:hover { font-weight:bold; text-decoration:none; background-color:#c0c0c0; }
		a:active { font-weight:bold; text-decoration:none; background-color:#c0c0c0; }
	
		.body
		{
		    font-family:Arial; 
			background-color: #e0e0e0;
			margin: 0px;
		}
		
		.tableSearchBox
		{
			width: 100%;
			background-color:#a0a0a0;
			border-bottom: solid 1px #000000;
		}
		
		.tableRowSearchBox
		{
			background-color:#a0a0a0;
			height: 35px;
			font-size:14px;
		}
		
		.tableCellSearch
		{
			padding-top: 2px;
			padding-bottom: 2px;
			padding-left: 4px;
			padding-right: 4px;
		}
		
		.textBoxSearch
		{
			font-size:16px;
			height:29px;
			width: 100%;
		}
		
		.tableCellLanguageCodes
		{
			width: 128px;
			padding-right: 2px;
		}
		
		.selectLanguageCode
		{
			width: 100%;
			height: 29px;
			font-size: 16px;
		}

		.tableCellClear
		{
			width: 31px;
			padding-right: 2px;
		}

		.buttonGo
		{
			font-size: 14px;
		}
		
		.titleBox
		{
			text-align: center;
		}
				
		.suggestionList
		{
			padding: 4px;
			overflow: auto;
		}
		
		.suggestionListEntry
		{
			min-height: 22px;
			text-decoration: none;
			color: #000000;
			font-family: Arial;
			font-Size: 16px;
			font-weight: bold;
			padding-left: 4px;
			padding-right: 4px;
			padding-top: 4px;
			padding-bottom: 0px;
			border-bottom: solid 1px #e0e0e0;
			background-color: #ffffff;
			vertical-align: bottom;
		}

		.suggestionListEntryMouseDown
		{
			min-height: 22px;
			text-decoration: none;
			color: #ffffff;
			font-family: Arial;
			font-Size: 16px;
			font-weight: bold;
			padding-left: 4px;
			padding-right: 4px;
			padding-top: 4px;
			padding-bottom: 0px;
			border-bottom: solid 1px #e0e0e0;
			background-color: #6060ff;
			vertical-align: bottom;
		}
				
		.imageGlobe
		{
		    border: none;
		}
		
		.linkHelp
		{
            font-size:16px;
			padding: 2px;
        }
	</style>
	
	<script language="javascript" type="text/javascript">
		var _baseUrl = "/wiki/";
		var url;
		var _defaultLanguageCode = "";
		var _currentLang = "";
		
		function GetXMLHTTPObject()
		{
			var errMsg;
			var xmlHttp;

			try 
			{
				xmlHttp = new XMLHttpRequest(); // works with IE7, Firefox, Netscape
			}
			catch(e) { errMsg = e; }
    
			if ( !xmlHttp )
			{
				try
				{
					xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   // works with IE6    
				}
				catch(e) { errMsg = e; }
			}
    
			if ( !xmlHttp )
			{
				alert("XMLHTTP could not be initialized! ("+errMsg+")");
				return;
			}
    
			return xmlHttp;
		}
		
		function GetInstalledLanguages()
		{
			var results = "";
			
			var xmlHttp = GetXMLHTTPObject();
			xmlHttp.open("GET", "/ajax/GetInstalledLanguages", false);
			xmlHttp.send();
			
			if ( xmlHttp.status==200 )
				result = xmlHttp.responseText;
			xmlHttp = null;
			
			if ( result=="" )
				return;
				
			var entries = result.split("\n");
			
			var i;
			for(i=0; i<entries.length; i++)
			{
				var langCode=entries[i].split(":")[0];
				var langName=entries[i].split(":")[1];
				AddLanguageListboxItem(langCode,langName,"langaugeCodes"); 
				//alert(entries[i].split(":")[0]); 
			}
			_currentLang=entries[0].split(":")[0];
			//alert(result);
		}
		function AddLanguageListboxItem(langCode,langName,listId)
		{
			var newLang;
			//alert (langCode);
			newLang = document.createElement("OPTION");
			newLang = new Option(langCode,langCode);
			newLang.value = langCode;
			newLang.text = langName;
			var listObj=document.getElementById(listId);
			listObj.add(newLang);
		}
		
		var _lastPhrase = "";
		var _lastPhraseResult = "";
		var _lastLanguageCode = "";
		
		function GetSuggestions(phrase)
		{
			if ( phrase==_lastPhrase)
				return _lastPhraseResult; 
				
			_lastLanguageCode = "";
			if ( phrase.length>=3 && phrase.charAt(2)==':' )
			{
				_lastLanguageCode = phrase.substr(0,2) + ":";
				if ( phrase.length<=3 ) 
					phrase = "";
			}
			
			var suggestions = "";
			if ( phrase!="" )
			{				
				var xmlHttp = GetXMLHTTPObject();
				xmlHttp.open("GET", "/ajax/search:" + phrase, false);
				xmlHttp.send();
			
				if ( xmlHttp.status==200 )
					suggestions = xmlHttp.responseText;
				xmlHttp = null;
			}
			
			_lastPhrase = phrase;
			_lastPhraseResult = suggestions;
			
			return suggestions;	
		}
		
		function DisplayArticle(articleName)
		{
			articleName = articleName.replace(/&quote;/g, "'");
			if ( articleName.charAt(2)==':' )
				window.location.href = _baseUrl + articleName;
			else
				window.location.href = _baseUrl + _lastLanguageCode + articleName;
		}
	
		function slMouseDown(tag)
		{
			if ( !tag )
				return;
				
			tag.className = "suggestionListEntryMouseDown";
		}

		function slMouseUp(tag)
		{
			if ( !tag )
				return;
				
			tag.className = "suggestionListEntry";
		}

		function LoadSuggestions()
		{
			var suggestionList = document.getElementById("suggestionList");
			
			suggestionList.innerHTML = "";
			var textBoxSearch = document.getElementById("textBoxSearch");
			if ( textBoxSearch.value.length>0 )
			{		
				var innerHTML = "";
				var result = GetSuggestions(_currentLang+":"+textBoxSearch.value);
				if ( result!="" )
				{
					var suggestions = result.split("\n");
					var i;
					
					for(i=0; i<suggestions.length; i++)
					{
						var suggestion = suggestions[i];						
						var target = suggestions[i].replace(/'/g, "&quote;");
						if ( suggestion!="" )
							innerHTML += "<div onmousedown='slMouseDown(this)' onmouseup='slMouseUp(this)' onmouseout='slMouseUp(this)' onclick=\"javascript:DisplayArticle('" + target + "')\" class=\"suggestionListEntry\">" + suggestion + "</div>";
						else
							innerHTML += "<div class='suggestionListEntry'>(...)</div>";
					}
				}
				
				suggestionList.innerHTML = innerHTML;
				SetSuggestionBoxVisiblity();
			} 
			else
				SetSuggestionBoxVisiblity();
		}

		function textBoxSearch_Change()
		{
			window.setTimeout("LoadSuggestions()", 0);
		}
		
		function SetSuggestionBoxVisiblity()
		{
			var suggestionList = document.getElementById("suggestionList");
			if ( !suggestionList )
				return;
				
			var titleBox = document.getElementById("titleBox");
			if ( !titleBox )
				return;
				
			if ( suggestionList.innerHTML=="" )
			{
				titleBox.style.display = "";
				suggestionList.style.display = "none";
				
				return;
			}
			
			suggestionList.style.display = "";
			titleBox.style.display = "none";
		}
		
		function textBoxSearch_Keypress()
		{
			if ( window.event.keyCode==13 )
			{
			    var textBoxSearch = document.getElementById("textBoxSearch");
			    if ( !textBoxSearch )
				    return;
			    DisplayArticle(textBoxSearch.value);
			    
			}
		}
		
		function initPage() 
		{
			GetInstalledLanguages();
			
		    // onKeyup didn't works for Chinese language, so we're polling the input for changes
            window.setInterval("CheckInput()", 250);
        }

        var _oldValue = "";
        function CheckInput()
        {
            var textBoxSearch = document.getElementById("textBoxSearch");
            var newValue = textBoxSearch.value;
            if ( _oldValue!=newValue ) 
            {
                _oldValue = newValue;
                window.setTimeout("LoadSuggestions()", 0);
            }
        }
		
		function imageClear_Click()
		{
			var textBoxSearch = document.getElementById("textBoxSearch");
			if ( !textBoxSearch )
				return;
			
			textBoxSearch.value = "";
            textBoxSearch.focus();
		}
	</script>
</head>
<body class="body" onload="initPage()">
	<!--<table class="tableSearchBox" border="0" cellpadding="0" cellspacing="0">
		<tr class="tableRowSearchBox">
			<td class="tableCellSearch">
				<input id="textBoxSearch" type="text" class="textBoxSearch" onkeypress="textBoxSearch_Keypress()" />
			</td>
			<td id="tableCellLanguageCodes" class="tableCellLanguageCodes" style="width:3.8em">

				<select id="langaugeCodes" name="languageCodes" size="1" class="selectLanguageCode" onchange="javascript:_currentLang=this.value;textBoxSearch_Change();">
				</select>
			</td>
			</td>
			<td class="tableCellClear">
				<img src="./images/clearButton.png" class="buttonClear" onclick="imageClear_Click()" />
			</td>
		</tr>
				<script lang="JavaScript">GetInstalledLanguages();</script>
	</table>-->
	<div id="titleBox" class="titleBox">
		<br />
		<span style="font-family:Arial; font-size:18px">Wiki2Touch - Wikipedia to go</span>
		<br />
		<br />
		<a href="/ajax/RedirectToRandomArticle" class="linkMain"><img src="./images/wiki-en.png" alt="Wiki globe" class="imageGlobe"/></a>
		<br />
		<br />
		<a href="/wiki/xx:Help" class="linkHelp">Need help?</a>
	</div>
	<div id="suggestionList" class="suggestionList"></div>
</body>
</html>
